baubs git
Commit 4428b8472c8aa309fbf9952cf270b33dbb1cfa0d
Parents : 085ac1a
Author : Jan-Henrik Bruhn <hi@jhbruhn.de>
Date : 2025-12-06T23:42:47+01:00
Properly preserve pattern filename after deletion for re-upload
Improve the previous fix by actually preserving the original filename
from the cache instead of using a generic fallback. This is a cleaner
solution that maintains the actual pattern name.
Changes:
- Add currentFileName state to App.tsx to track pattern filename
- When loading cached pattern, preserve resumeFileName in currentFileName
- When loading new pattern, pass fileName to handlePatternLoaded callback
- Pass currentFileName to FileUpload component as prop
- Use currentFileName in displayFileName logic (prioritized first)
- Remove generic 'pattern.pes' fallback
Now when you delete a cached pattern and re-upload it, the original
filename (e.g., "mypattern.pes") is preserved instead of using a
generic fallback name. This maintains better traceability.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Changes
2 files changed, 14 insertions(+), 5 deletions(-)
Diff
diff --git a/src/App.tsx b/src/App.tsx
index 1d2eea4..532b1b4 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -19,6 +19,7 @@ function App() {
const [pyodideError, setPyodideError] = useState<string | null>(null);
const [patternOffset, setPatternOffset] = useState<{ x: number; y: number }>({ x: 0, y: 0 });
const [patternUploaded, setPatternUploaded] = useState(false);
+ const [currentFileName, setCurrentFileName] = useState<string>(''); // Track current pattern filename
// Initialize Pyodide on mount
useEffect(() => {
@@ -43,11 +44,16 @@ function App() {
if (machine.resumedPattern.patternOffset) {
setPatternOffset(machine.resumedPattern.patternOffset);
}
+ // Preserve the filename from cache
+ if (machine.resumeFileName) {
+ setCurrentFileName(machine.resumeFileName);
+ }
}
}, [machine.resumedPattern, pesData, machine.resumeFileName]);
- const handlePatternLoaded = useCallback((data: PesPatternData) => {
+ const handlePatternLoaded = useCallback((data: PesPatternData, fileName: string) => {
setPesData(data);
+ setCurrentFileName(fileName);
// Reset pattern offset when new pattern is loaded
setPatternOffset({ x: 0, y: 0 });
setPatternUploaded(false);
@@ -185,6 +191,7 @@ function App() {
resumeAvailable={machine.resumeAvailable}
resumeFileName={machine.resumeFileName}
pesData={pesData}
+ currentFileName={currentFileName}
isUploading={machine.isUploading}
/>
)}
diff --git a/src/components/FileUpload.tsx b/src/components/FileUpload.tsx
index 4cf0031..4e8ce52 100644
--- a/src/components/FileUpload.tsx
+++ b/src/components/FileUpload.tsx
@@ -9,7 +9,7 @@ interface FileUploadProps {
isConnected: boolean;
machineStatus: MachineStatus;
uploadProgress: number;
- onPatternLoaded: (pesData: PesPatternData) => void;
+ onPatternLoaded: (pesData: PesPatternData, fileName: string) => void;
onUpload: (penData: Uint8Array, pesData: PesPatternData, fileName: string, patternOffset?: { x: number; y: number }) => void;
pyodideReady: boolean;
patternOffset: { x: number; y: number };
@@ -17,6 +17,7 @@ interface FileUploadProps {
resumeAvailable: boolean;
resumeFileName: string | null;
pesData: PesPatternData | null;
+ currentFileName: string;
isUploading?: boolean;
}
@@ -32,6 +33,7 @@ export function FileUpload({
resumeAvailable,
resumeFileName,
pesData: pesDataProp,
+ currentFileName,
isUploading = false,
}: FileUploadProps) {
const [localPesData, setLocalPesData] = useState<PesPatternData | null>(null);
@@ -39,8 +41,8 @@ export function FileUpload({
// Use prop pesData if available (from cached pattern), otherwise use local state
const pesData = pesDataProp || localPesData;
- // When resumeFileName is cleared but we still have pesData, preserve the filename
- const displayFileName = resumeFileName || fileName || (pesDataProp ? 'pattern.pes' : '');
+ // Use currentFileName from App state, or local fileName, or resumeFileName for display
+ const displayFileName = currentFileName || fileName || resumeFileName || '';
const [isLoading, setIsLoading] = useState(false);
const handleFileChange = useCallback(
@@ -58,7 +60,7 @@ export function FileUpload({
const data = await convertPesToPen(file);
setLocalPesData(data);
setFileName(file.name);
- onPatternLoaded(data);
+ onPatternLoaded(data, file.name);
} catch (err) {
alert(
`Failed to load PES file: ${
Served by rngit 1.3.3 - Generated in 0.04s